<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta content="width=device-width, initial-scale=1, maximum-scale=1,
			shrink-to-fit=no" name="viewport">
	<title>Aegis - Admin Dashboard Template</title>
	<!-- General CSS Files -->
	<link rel="stylesheet" href="assets/css/app.min.css">
	<!-- Template CSS -->
	<link rel="stylesheet" href="assets/css/style.css">
	<link rel="stylesheet" href="assets/css/components.css">
	<!-- Custom style CSS -->
	<link rel="stylesheet" href="assets/css/custom.css">
	<link rel='shortcut icon' type='image/x-icon' href='assets/img/favicon.ico' />
</head>

<body>
	<div class="loader"></div>
	<div id="app">
		<div class="main-wrapper main-wrapper-1">
			<div class="navbar-bg"></div>
			<nav class="navbar navbar-expand-lg main-navbar">
				<div class="form-inline mr-auto">
					<ul class="navbar-nav mr-3">
						<li><a href="#" data-toggle="sidebar" class="nav-link nav-link-lg
									collapse-btn"> <i data-feather="align-justify"></i></a></li>
						<li><a href="#" class="nav-link nav-link-lg fullscreen-btn">
								<i data-feather="maximize"></i>
							</a></li>
						<li>
							<form class="form-inline mr-auto">
								<div class="search-element">
									<input class="form-control" type="search" placeholder="Search" aria-label="Search"
										data-width="200">
									<button class="btn" type="submit">
										<i class="fas fa-search"></i>
									</button>
								</div>
							</form>
						</li>
					</ul>
				</div>
				<ul class="navbar-nav navbar-right">
					<li class="dropdown dropdown-list-toggle"><a href="#" data-toggle="dropdown"
							class="nav-link nav-link-lg message-toggle"><i data-feather="mail"></i>
							<span class="badge headerBadge1">
								6 </span> </a>
						<div class="dropdown-menu dropdown-list dropdown-menu-right pullDown">
							<div class="dropdown-header">
								Messages
								<div class="float-right">
									<a href="#">Mark All As Read</a>
								</div>
							</div>
							<div class="dropdown-list-content dropdown-list-message">
								<a href="#" class="dropdown-item"> <span class="dropdown-item-avatar
											text-white"> <img alt="image" src="assets/img/users/user-1.png" class="rounded-circle">
									</span> <span class="dropdown-item-desc"> <span class="message-user">John
											Deo</span>
										<span class="time messege-text">Please check your mail !!</span>
										<span class="time">2 Min Ago</span>
									</span>
								</a> <a href="#" class="dropdown-item"> <span class="dropdown-item-avatar text-white">
										<img alt="image" src="assets/img/users/user-2.png" class="rounded-circle">
									</span> <span class="dropdown-item-desc"> <span class="message-user">Sarah
											Smith</span> <span class="time messege-text">Request for leave
											application</span>
										<span class="time">5 Min Ago</span>
									</span>
								</a> <a href="#" class="dropdown-item"> <span class="dropdown-item-avatar text-white">
										<img alt="image" src="assets/img/users/user-5.png" class="rounded-circle">
									</span> <span class="dropdown-item-desc"> <span class="message-user">Jacob
											Ryan</span> <span class="time messege-text">Your payment invoice is
											generated.</span> <span class="time">12 Min Ago</span>
									</span>
								</a> <a href="#" class="dropdown-item"> <span class="dropdown-item-avatar text-white">
										<img alt="image" src="assets/img/users/user-4.png" class="rounded-circle">
									</span> <span class="dropdown-item-desc"> <span class="message-user">Lina
											Smith</span> <span class="time messege-text">hii John, I have upload
											doc
											related to task.</span> <span class="time">30
											Min Ago</span>
									</span>
								</a> <a href="#" class="dropdown-item"> <span class="dropdown-item-avatar text-white">
										<img alt="image" src="assets/img/users/user-3.png" class="rounded-circle">
									</span> <span class="dropdown-item-desc"> <span class="message-user">Jalpa
											Joshi</span> <span class="time messege-text">Please do as specify.
											Let me
											know if you have any query.</span> <span class="time">1
											Days Ago</span>
									</span>
								</a> <a href="#" class="dropdown-item"> <span class="dropdown-item-avatar text-white">
										<img alt="image" src="assets/img/users/user-2.png" class="rounded-circle">
									</span> <span class="dropdown-item-desc"> <span class="message-user">Sarah
											Smith</span> <span class="time messege-text">Client Requirements</span>
										<span class="time">2 Days Ago</span>
									</span>
								</a>
							</div>
							<div class="dropdown-footer text-center">
								<a href="#">View All <i class="fas fa-chevron-right"></i></a>
							</div>
						</div>
					</li>
					<li class="dropdown dropdown-list-toggle"><a href="#" data-toggle="dropdown"
							class="nav-link notification-toggle nav-link-lg"><i data-feather="bell"></i>
							<span class="badge headerBadge2">
								3 </span> </a>
						<div class="dropdown-menu dropdown-list dropdown-menu-right pullDown">
							<div class="dropdown-header">
								Notifications
								<div class="float-right">
									<a href="#">Mark All As Read</a>
								</div>
							</div>
							<div class="dropdown-list-content dropdown-list-icons">
								<a href="#" class="dropdown-item dropdown-item-unread"> <span
										class="dropdown-item-icon bg-primary text-white"> <i class="fas
												fa-code"></i>
									</span> <span class="dropdown-item-desc"> Template update is
										available now! <span class="time">2 Min
											Ago</span>
									</span>
								</a> <a href="#" class="dropdown-item"> <span
										class="dropdown-item-icon bg-info text-white"> <i class="far
												fa-user"></i>
									</span> <span class="dropdown-item-desc"> <b>You</b> and <b>Dedik
											Sugiharto</b> are now friends <span class="time">10 Hours
											Ago</span>
									</span>
								</a> <a href="#" class="dropdown-item"> <span
										class="dropdown-item-icon bg-success text-white"> <i class="fas
												fa-check"></i>
									</span> <span class="dropdown-item-desc"> <b>Kusnaedi</b> has
										moved task <b>Fix bug header</b> to <b>Done</b> <span class="time">12
											Hours
											Ago</span>
									</span>
								</a> <a href="#" class="dropdown-item"> <span
										class="dropdown-item-icon bg-danger text-white"> <i
											class="fas fa-exclamation-triangle"></i>
									</span> <span class="dropdown-item-desc"> Low disk space. Let's
										clean it! <span class="time">17 Hours Ago</span>
									</span>
								</a> <a href="#" class="dropdown-item"> <span
										class="dropdown-item-icon bg-info text-white"> <i class="fas
												fa-bell"></i>
									</span> <span class="dropdown-item-desc"> Welcome to Aegis
										template! <span class="time">Yesterday</span>
									</span>
								</a>
							</div>
							<div class="dropdown-footer text-center">
								<a href="#">View All <i class="fas fa-chevron-right"></i></a>
							</div>
						</div>
					</li>
					<li class="dropdown"><a href="#" data-toggle="dropdown"
							class="nav-link dropdown-toggle nav-link-lg nav-link-user"> <img alt="image"
								src="assets/img/user.png" class="user-img-radious-style"> <span
								class="d-sm-none d-lg-inline-block"></span></a>
						<div class="dropdown-menu dropdown-menu-right pullDown">
							<div class="dropdown-title">Hello Sarah Smith</div>
							<a href="profile.html" class="dropdown-item has-icon"> <i class="far
										fa-user"></i> Profile
							</a> <a href="timeline.html" class="dropdown-item has-icon"> <i class="fas fa-bolt"></i>
								Activities
							</a> <a href="" class="dropdown-item has-icon"> <i class="fas fa-cog"></i>
								Settings
							</a>
							<div class="dropdown-divider"></div>
							<a href="auth-login.html" class="dropdown-item has-icon text-danger"> <i
									class="fas fa-sign-out-alt"></i> Logout
							</a>
						</div>
					</li>
				</ul>
			</nav>
			<div class="main-sidebar sidebar-style-2">
				<aside id="sidebar-wrapper">
					<div class="sidebar-brand">
						<a href="index.html"> <img alt="image" src="assets/img/logo.png" class="header-logo" /> <span
								class="logo-name">Aegis</span>
						</a>
					</div>
					<div class="sidebar-user">
						<div class="sidebar-user-picture">
							<img alt="image" src="assets/img/userbig.png">
						</div>
						<div class="sidebar-user-details">
							<div class="user-name">Sarah Smith</div>
							<div class="user-role">Administrator</div>
						</div>
					</div>
					<ul class="sidebar-menu">
						<li class="menu-header">Main</li>
						<li class="dropdown active"><a href="#" class="nav-link has-dropdown"><i
									data-feather="monitor"></i><span>Dashboard</span>
							</a>
							<ul class="dropdown-menu">
								<li><a class="nav-link" href="index.html">Dashboard
										V1</a></li>
								<li class="active"><a class="nav-link" href="index2.html">Dashboard V2</a></li>
							</ul>
						</li>
						<li class="dropdown"><a href="#" class="nav-link has-dropdown"><i
									data-feather="briefcase"></i><span>Widgets</span></a>
							<ul class="dropdown-menu">
								<li><a class="nav-link" href="widget-chart.html">Chart
										Widgets</a></li>
								<li><a class="nav-link" href="widget-data.html">Data
										Widgets</a></li>
							</ul>
						</li>
						<li class="dropdown"><a href="#" class="nav-link has-dropdown"><i
									data-feather="command"></i><span>Apps</span></a>
							<ul class="dropdown-menu">
								<li><a class="nav-link" href="chat.html">Chat</a></li>
								<li><a class="nav-link" href="portfolio.html">Portfolio</a></li>
								<li><a class="nav-link" href="blog.html">Blog</a></li>
								<li><a class="nav-link" href="calendar.html">Calendar</a></li>
							</ul>
						</li>
						<li class="dropdown"><a href="#" class="nav-link has-dropdown"><i
									data-feather="mail"></i><span>Email</span></a>
							<ul class="dropdown-menu">
								<li><a class="nav-link" href="email-inbox.html">Inbox</a></li>
								<li><a class="nav-link" href="email-compose.html">Compose</a></li>
								<li><a class="nav-link" href="email-read.html">read</a></li>
							</ul>
						</li>
						<li class="menu-header">UI Elements</li>
						<li class="dropdown"><a href="#" class="nav-link has-dropdown"><i
									data-feather="copy"></i><span>Basic
									Components</span></a>
							<ul class="dropdown-menu">
								<li><a class="nav-link" href="alert.html">Alert</a></li>
								<li><a class="nav-link" href="badge.html">Badge</a></li>
								<li><a class="nav-link" href="breadcrumb.html">Breadcrumb</a></li>
								<li><a class="nav-link" href="buttons.html">Buttons</a></li>
								<li><a class="nav-link" href="collapse.html">Collapse</a></li>
								<li><a class="nav-link" href="dropdown.html">Dropdown</a></li>
								<li><a class="nav-link" href="checkbox-and-radio.html">Checkbox
										&amp; Radios</a></li>
								<li><a class="nav-link" href="list-group.html">List
										Group</a></li>
								<li><a class="nav-link" href="media-object.html">Media
										Object</a></li>
								<li><a class="nav-link" href="navbar.html">Navbar</a></li>
								<li><a class="nav-link" href="pagination.html">Pagination</a></li>
								<li><a class="nav-link" href="popover.html">Popover</a></li>
								<li><a class="nav-link" href="progress.html">Progress</a></li>
								<li><a class="nav-link" href="tooltip.html">Tooltip</a></li>
								<li><a class="nav-link" href="flags.html">Flag</a></li>
								<li><a class="nav-link" href="typography.html">Typography</a></li>
							</ul>
						</li>
						<li class="dropdown"><a href="#" class="nav-link has-dropdown"><i
									data-feather="shopping-bag"></i><span>Advanced</span></a>
							<ul class="dropdown-menu">
								<li><a class="nav-link" href="avatar.html">Avatar</a></li>
								<li><a class="nav-link" href="card.html">Card</a></li>
								<li><a class="nav-link" href="modal.html">Modal</a></li>
								<li><a class="nav-link" href="sweet-alert.html">Sweet
										Alert</a></li>
								<li><a class="nav-link" href="toastr.html">Toastr</a></li>
								<li><a class="nav-link" href="empty-state.html">Empty
										State</a></li>
								<li><a class="nav-link" href="multiple-upload.html">Multiple
										Upload</a></li>
								<li><a class="nav-link" href="pricing.html">Pricing</a></li>
								<li><a class="nav-link" href="tabs.html">Tab</a></li>
							</ul>
						</li>
						<li><a class="nav-link" href="blank.html"><i data-feather="file"></i><span>Blank
									Page</span></a>
						</li>
						<li class="menu-header">Aegis</li>
						<li class="dropdown"><a href="#" class="nav-link has-dropdown"><i
									data-feather="layout"></i><span>Forms</span></a>
							<ul class="dropdown-menu">
								<li><a class="nav-link" href="basic-form.html">Basic
										Form</a></li>
								<li><a class="nav-link" href="forms-advanced-form.html">Advanced
										Form</a></li>
								<li><a class="nav-link" href="forms-editor.html">Editor</a></li>
								<li><a class="nav-link" href="forms-validation.html">Validation</a></li>
								<li><a class="nav-link" href="form-wizard.html">Form
										Wizard</a></li>
							</ul>
						</li>
						<li class="dropdown"><a href="#" class="nav-link has-dropdown"><i
									data-feather="grid"></i><span>Tables</span></a>
							<ul class="dropdown-menu">
								<li><a class="nav-link" href="basic-table.html">Basic
										Tables</a></li>
								<li><a class="nav-link" href="advance-table.html">Advanced
										Table</a></li>
								<li><a class="nav-link" href="datatables.html">Datatable</a></li>
								<li><a class="nav-link" href="export-table.html">Export
										Table</a></li>
								<li><a class="nav-link" href="editable-table.html">Editable
										Table</a></li>
							</ul>
						</li>
						<li class="dropdown"><a href="#" class="nav-link has-dropdown"><i
									data-feather="pie-chart"></i><span>Charts</span></a>
							<ul class="dropdown-menu">
								<li><a class="nav-link" href="chart-amchart.html">amChart</a></li>
								<li><a class="nav-link" href="chart-apexchart.html">apexchart</a></li>
								<li><a class="nav-link" href="chart-echart.html">eChart</a></li>
								<li><a class="nav-link" href="chart-chartjs.html">Chartjs</a></li>
								<li><a class="nav-link" href="chart-sparkline.html">Sparkline</a></li>
								<li><a class="nav-link" href="chart-morris.html">Morris</a></li>
							</ul>
						</li>
						<li class="dropdown"><a href="#" class="nav-link has-dropdown"><i
									data-feather="feather"></i><span>Icons</span></a>
							<ul class="dropdown-menu">
								<li><a class="nav-link" href="icon-font-awesome.html">Font
										Awesome</a></li>
								<li><a class="nav-link" href="icon-material.html">Material
										Design</a></li>
								<li><a class="nav-link" href="icon-ionicons.html">Ion Icons</a></li>
								<li><a class="nav-link" href="icon-feather.html">Feather Icons</a></li>
								<li><a class="nav-link" href="icon-weather-icon.html">Weather
										Icon</a></li>
							</ul>
						</li>
						<li class="menu-header">Media</li>
						<li class="dropdown"><a href="#" class="nav-link has-dropdown"><i
									data-feather="image"></i><span>Gallery</span></a>
							<ul class="dropdown-menu">
								<li><a class="nav-link" href="light-gallery.html">Light
										Gallery</a></li>
								<li><a href="gallery1.html">Gallery 2</a></li>
							</ul>
						</li>
						<li class="dropdown"><a href="#" class="nav-link has-dropdown"><i
									data-feather="flag"></i><span>Sliders</span></a>
							<ul class="dropdown-menu">
								<li><a href="carousel.html">Bootstrap Carousel.html</a></li>
								<li><a class="nav-link" href="owl-carousel.html">Owl
										Carousel</a></li>
							</ul>
						</li>
						<li><a class="nav-link" href="timeline.html"><i
									data-feather="sliders"></i><span>Timeline</span></a></li>
						<li class="menu-header">Maps</li>
						<li class="dropdown"><a href="#" class="nav-link has-dropdown"><i
									data-feather="map"></i><span>Google
									Maps</span></a>
							<ul class="dropdown-menu">
								<li><a href="gmaps-advanced-route.html">Advanced Route</a></li>
								<li><a href="gmaps-draggable-marker.html">Draggable
										Marker</a></li>
								<li><a href="gmaps-geocoding.html">Geocoding</a></li>
								<li><a href="gmaps-geolocation.html">Geolocation</a></li>
								<li><a href="gmaps-marker.html">Marker</a></li>
								<li><a href="gmaps-multiple-marker.html">Multiple
										Marker</a></li>
								<li><a href="gmaps-route.html">Route</a></li>
								<li><a href="gmaps-simple.html">Simple</a></li>
							</ul>
						</li>
						<li><a class="nav-link" href="vector-map.html"><i data-feather="map-pin"></i><span>Vector
									Map</span></a></li>
						<li class="menu-header">Pages</li>
						<li class="dropdown"><a href="#" class="nav-link has-dropdown"><i
									data-feather="user-check"></i><span>Auth</span></a>
							<ul class="dropdown-menu">
								<li><a href="auth-login.html">Login</a></li>
								<li><a href="auth-register.html">Register</a></li>
								<li><a href="auth-forgot-password.html">Forgot Password</a></li>
								<li><a href="auth-reset-password.html">Reset Password</a></li>
								<li><a href="subscribe.html">Subscribe</a></li>
							</ul>
						</li>
						<li class="dropdown"><a href="#" class="nav-link has-dropdown"><i
									data-feather="alert-triangle"></i><span>Errors</span></a>
							<ul class="dropdown-menu">
								<li><a class="nav-link" href="errors-503.html">503</a></li>
								<li><a class="nav-link" href="errors-403.html">403</a></li>
								<li><a class="nav-link" href="errors-404.html">404</a></li>
								<li><a class="nav-link" href="errors-500.html">500</a></li>
							</ul>
						</li>
						<li class="dropdown"><a href="#" class="nav-link has-dropdown"><i
									data-feather="anchor"></i><span>Other
									Pages</span></a>
							<ul class="dropdown-menu">
								<li><a class="nav-link" href="create-post.html">Create
										Post</a></li>
								<li><a class="nav-link" href="posts.html">Posts</a></li>
								<li><a class="nav-link" href="profile.html">Profile</a></li>
								<li><a class="nav-link" href="contact.html">Contact</a></li>
								<li><a class="nav-link" href="invoice.html">Invoice</a></li>
							</ul>
						</li>
						<li class="dropdown"><a href="#" class="nav-link has-dropdown"><i
									data-feather="chevrons-down"></i><span>Multilevel</span></a>
							<ul class="dropdown-menu">
								<li><a href="#">Menu 1</a></li>
								<li class="dropdown"><a href="#" class="has-dropdown">Menu
										2</a>
									<ul class="dropdown-menu">
										<li><a href="#">Child Menu 1</a></li>
										<li class="dropdown"><a href="#" class="has-dropdown">Child
												Menu 2</a>
											<ul class="dropdown-menu">
												<li><a href="#">Child Menu 1</a></li>
												<li><a href="#">Child Menu 2</a></li>
											</ul>
										</li>
										<li><a href="#"> Child Menu 3</a></li>
									</ul>
								</li>
							</ul>
						</li>
					</ul>
				</aside>
			</div>
			<!-- Main Content -->
			<div class="main-content">
				<section class="section">
					<div class="row">
						<div class="col-xl-3 col-lg-6">
							<div class="card">
								<div class="card-bg">
									<div class="p-t-20 d-flex justify-content-between">
										<div class="col">
											<h6 class="mb-0">New Booking</h6>
											<span class="font-weight-bold mb-0 font-20">1,562</span>
										</div>
										<i class="fas fa-address-card card-icon col-orange font-30 p-r-30"></i>
									</div>
									<canvas id="cardChart1" height="80"></canvas>
								</div>
							</div>
						</div>
						<div class="col-xl-3 col-lg-6">
							<div class="card">
								<div class="card-bg">
									<div class="p-t-20 d-flex justify-content-between">
										<div class="col">
											<h6 class="mb-0">New Customers</h6>
											<span class="font-weight-bold mb-0 font-20">895</span>
										</div>
										<i class="fas fa-diagnoses card-icon col-green font-30 p-r-30"></i>
									</div>
									<canvas id="cardChart2" height="80"></canvas>
								</div>
							</div>
						</div>
						<div class="col-xl-3 col-lg-6">
							<div class="card">
								<div class="card-bg">
									<div class="p-t-20 d-flex justify-content-between">
										<div class="col">
											<h6 class="mb-0">Growth</h6>
											<span class="font-weight-bold mb-0 font-20">+22.58%</span>
										</div>
										<i class="fas fa-chart-bar card-icon col-indigo font-30 p-r-30"></i>
									</div>
									<canvas id="cardChart3" height="80"></canvas>
								</div>
							</div>
						</div>
						<div class="col-xl-3 col-lg-6">
							<div class="card">
								<div class="card-bg">
									<div class="p-t-20 d-flex justify-content-between">
										<div class="col">
											<h6 class="mb-0">Revenue</h6>
											<span class="font-weight-bold mb-0 font-20">$2,687</span>
										</div>
										<i class="fas fa-hand-holding-usd card-icon col-cyan font-30 p-r-30"></i>
									</div>
									<canvas id="cardChart4" height="80"></canvas>
								</div>
							</div>
						</div>
					</div>
					<div class="row">
						<div class="col-xl-8 col-md-12 col-lg-8">
							<div class="card">
								<div class="card-header">
									<h4>Revenue Chart</h4>
								</div>
								<div class="card-body">
									<ul class="list-inline text-center">
										<li class="list-inline-item p-r-30"><i data-feather="arrow-up-circle"
												class="col-green"></i>
											<h5 class="m-b-0">$675</h5>
											<p class="text-muted font-14 m-b-0">Weekly Earnings</p>
										</li>
										<li class="list-inline-item p-r-30"><i data-feather="arrow-down-circle"
												class="col-orange"></i>
											<h5 class="m-b-0">$1,587</h5>
											<p class="text-muted font-14 m-b-0">Monthly Earnings</p>
										</li>
										<li class="list-inline-item p-r-30"><i data-feather="arrow-up-circle"
												class="col-green"></i>
											<h5 class="mb-0 m-b-0">$45,965</h5>
											<p class="text-muted font-14 m-b-0">Yearly Earnings</p>
										</li>
									</ul>
									<div id="myChart"></div>
								</div>
							</div>
						</div>
						<div class="col-xl-4 col-md-12 col-lg-4">
							<div class="card l-bg-orange">
								<div class="card-body">
									<div class="text-white">
										<div class="row">
											<div class="col-md-6 col-lg-5">
												<h4 class="mb-0 font-26">$1,235</h4>
												<p class="mb-2">Avg Sales Per Month</p>
												<p class="mb-0">
													<span class="font-20">+11.25% </span>Increase
												</p>
											</div>
											<div class="col-md-6 col-lg-7">
												<div class="sparkline-bar p-t-50"></div>
											</div>
										</div>
									</div>
								</div>
							</div>
							<div class="card l-bg-cyan">
								<div class="card-body">
									<div class="text-white">
										<div class="row">
											<div class="col-md-6 col-lg-5">
												<h4 class="mb-0 font-26">758</h4>
												<p class="mb-2">Avg new Cust Per Month</p>
												<p class="mb-0">
													<span class="font-20">+25.11%</span> Increase
												</p>
											</div>
											<div class="col-md-6 col-lg-7">
												<div class="sparkline-line p-t-50"></div>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="row">
						<div class="col-lg-4 col-md-12 col-12 col-sm-12">
							<div class="card mt-sm-5 mt-md-0">
								<div class="card-header">
									<h4>Messages</h4>
								</div>
								<div class="card-body">
									<ul class="list-unstyled list-unstyled-border user-list" id="message-list">
										<li class="media"><img alt="image" src="assets/img/users/user-1.png"
												class="mr-3 user-img-radious-style user-list-img">
											<div class="media-body">
												<div class="mt-0 font-weight-bold">Cara Stevens</div>
												<div class="text-small">Hello How R You?</div>
											</div>
										</li>
										<li class="media"><img alt="image" src="assets/img/users/user-4.png"
												class="mr-3 user-img-radious-style user-list-img">
											<div class="media-body">
												<div class="mt-0 font-weight-bold">Airi Satou</div>
												<div class="text-small">Please email me regarding this</div>
											</div>
										</li>
										<li class="media"><img alt="image" src="assets/img/users/user-7.png"
												class="mr-3 user-img-radious-style user-list-img">
											<div class="media-body">
												<div class="mt-0 font-weight-bold">Angelica Ramos</div>
												<div class="text-small">Will You marry me??</div>
											</div>
										</li>
										<li class="media"><img alt="image" src="assets/img/users/user-2.png"
												class="mr-3 user-img-radious-style user-list-img">
											<div class="media-body">
												<div class="mt-0 font-weight-bold">Ashton Cox</div>
												<div class="text-small">Can't talk!!!</div>
											</div>
										</li>
										<li class="media"><img alt="image" src="assets/img/users/user-3.png"
												class="mr-3 user-img-radious-style user-list-img">
											<div class="media-body">
												<div class="mt-0 font-weight-bold">Cara Stevens</div>
												<div class="text-small">Request for leave application</div>
											</div>
										</li>
									</ul>
								</div>
							</div>
						</div>
						<div class="col-lg-4 col-md-12 col-12 col-sm-12">
							<div class="card">
								<div class="card-header">
									<h4>Revenue</h4>
								</div>
								<div class="card-body">
									<h3 class="card-title">
										<i class="fas fa-dollar-sign col-green font-30 p-b-10"></i>
										763,215
									</h3>
									<canvas id="myChart3" height="170"></canvas>
									<div class="row p-t-20">
										<div class="col-6">
											<p class="text-muted font-15 text-truncate m-b-5">Target</p>
											<h5>
												<i class="fas fa-arrow-circle-up col-green m-r-5"></i>$15.3k
											</h5>
										</div>
										<div class="col-6">
											<p class="text-muted text-truncate m-b-5">Last Month</p>
											<h5>
												<i class="fas fa-arrow-circle-up col-green m-r-5"></i>$12.5k
											</h5>
										</div>
									</div>
								</div>
							</div>
						</div>
						<div class="col-lg-4 col-md-12 col-12 col-sm-12">
							<div class="card">
								<div class="card-header">
									<h4>TODO</h4>
								</div>
								<div class="card-body">
									<div class="tdl-content">
										<ul class="to-do-list ui-sortable">
											<li class="clearfix">
												<div class="form-check m-l-10">
													<label class="form-check-label"> <input class="form-check-input"
															type="checkbox" value="">
														Add salary details in system <span class="form-check-sign">
															<span class="check"></span>
														</span>
													</label>
												</div>
												<div class="todo-actionlist pull-right clearfix">
													<a href="#"> <i class="material-icons">clear</i>
													</a>
												</div>
											</li>
											<li class="clearfix">
												<div class="form-check m-l-10">
													<label class="form-check-label"> <input class="form-check-input"
															type="checkbox" value="">
														Announcement for holiday <span class="form-check-sign">
															<span class="check"></span>
														</span>
													</label>
												</div>
												<div class="todo-actionlist pull-right clearfix">
													<a href="#"> <i class="material-icons">clear</i>
													</a>
												</div>
											</li>
											<li class="clearfix">
												<div class="form-check m-l-10">
													<label class="form-check-label"> <input class="form-check-input"
															type="checkbox" value="">
														call bus driver <span class="form-check-sign"> <span
																class="check"></span>
														</span>
													</label>
												</div>
												<div class="todo-actionlist pull-right clearfix">
													<a href="#"> <i class="material-icons">clear</i>
													</a>
												</div>
											</li>
											<li class="clearfix">
												<div class="form-check m-l-10">
													<label class="form-check-label"> <input class="form-check-input"
															type="checkbox" value="">
														Office Picnic <span class="form-check-sign"> <span
																class="check"></span>
														</span>
													</label>
												</div>
												<div class="todo-actionlist pull-right clearfix">
													<a href="#"> <i class="material-icons">clear</i>
													</a>
												</div>
											</li>
											<li class="clearfix">
												<div class="form-check m-l-10">
													<label class="form-check-label"> <input class="form-check-input"
															type="checkbox" value="">
														Website Must Be Finished <span class="form-check-sign">
															<span class="check"></span>
														</span>
													</label>
												</div>
												<div class="todo-actionlist pull-right clearfix">
													<a href="#"> <i class="material-icons">clear</i>
													</a>
												</div>
											</li>
											<li class="clearfix">
												<div class="form-check m-l-10">
													<label class="form-check-label"> <input class="form-check-input"
															type="checkbox" value="">
														Recharge My Mobile <span class="form-check-sign"> <span
																class="check"></span>
														</span>
													</label>
												</div>
												<div class="todo-actionlist pull-right clearfix">
													<a href="#"> <i class="material-icons">clear</i>
													</a>
												</div>
											</li>
											<li class="clearfix">
												<div class="form-check m-l-10">
													<label class="form-check-label"> <input class="form-check-input"
															type="checkbox" value="">
														Add salary details in system <span class="form-check-sign">
															<span class="check"></span>
														</span>
													</label>
												</div>
												<div class="todo-actionlist pull-right clearfix">
													<a href="#"> <i class="material-icons">clear</i>
													</a>
												</div>
											</li>
										</ul>
									</div>
									<div class="">
										<input type="text" class="tdl-new form-control">
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="row">
						<div class="col-12">
							<div class="card ">
								<div class="card-header">
									<h4>World wide sales</h4>
								</div>
								<div class="card-body">
									<div class="row">
										<div class="col-lg-8 col-md-8 col-sm-12 col-xs-12">
											<div id="visitorMap"></div>
										</div>
										<div class="col-lg-4 col-md-4 col-sm-12 col-xs-12">
											<p class="text-muted mb-1">World wide sell in different countries</p>
											<div class="mb-4">
												<div class="progress-title">
													<span>Egypt</span>
													<span class="float-right">45%</span>
												</div>
												<div class="progress mb-3" data-height="5">
													<div class="progress-bar" role="progressbar" data-width="45%"
														aria-valuenow="45" aria-valuemin="0" aria-valuemax="100"></div>
												</div>
											</div>
											<div class="mb-4">
												<div class="progress-title">
													<span>Nigeria</span>
													<span class="float-right">55%</span>
												</div>
												<div class="progress mb-3" data-height="5">
													<div class="progress-bar l-bg-purple" role="progressbar"
														data-width="55%" aria-valuenow="55" aria-valuemin="0"
														aria-valuemax="100"></div>
												</div>
											</div>
											<div class="mb-4">
												<div class="progress-title">
													<span>Canada</span>
													<span class="float-right">25%</span>
												</div>
												<div class="progress mb-3" data-height="5">
													<div class="progress-bar l-bg-orange" role="progressbar"
														data-width="25%" aria-valuenow="25" aria-valuemin="0"
														aria-valuemax="100"></div>
												</div>
											</div>
											<div class="mb-4">
												<div class="progress-title">
													<span>Turkey</span>
													<span class="float-right">43%</span>
												</div>
												<div class="progress mb-3" data-height="5">
													<div class="progress-bar l-bg-cyan" role="progressbar"
														data-width="43%" aria-valuenow="43" aria-valuemin="0"
														aria-valuemax="100"></div>
												</div>
											</div>
											<div class="mb-4">
												<div class="progress-title">
													<span>Australia</span>
													<span class="float-right">72%</span>
												</div>
												<div class="progress mb-3" data-height="5">
													<div class="progress-bar l-bg-green" role="progressbar"
														data-width="72%" aria-valuenow="72" aria-valuemin="0"
														aria-valuemax="100"></div>
												</div>
											</div>
											<div class="mb-4">
												<div class="progress-title">
													<span>Thailand</span>
													<span class="float-right">55%</span>
												</div>
												<div class="progress mb-3" data-height="5">
													<div class="progress-bar l-bg-purple" role="progressbar"
														data-width="55%" aria-valuenow="55" aria-valuemin="0"
														aria-valuemax="100"></div>
												</div>
											</div>
											<div class="mb-4">
												<div class="progress-title">
													<span>Panama</span>
													<span class="float-right">34%</span>
												</div>
												<div class="progress mb-3" data-height="5">
													<div class="progress-bar l-bg-orange" role="progressbar"
														data-width="34%" aria-valuenow="34" aria-valuemin="0"
														aria-valuemax="100"></div>
												</div>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</section>
				<div class="settingSidebar">
					<a href="javascript:void(0)" class="settingPanelToggle"> <i class="fa
								fa-spin fa-cog"></i>
					</a>
					<div class="settingSidebar-body ps-container ps-theme-default">
						<div class="fade show active">
							<div class="setting-panel-header">Setting Panel</div>
							<div class="p-15 border-bottom">
								<h6 class="font-medium m-b-10">Select Layout</h6>
								<div class="selectgroup layout-color w-50">
									<label class="selectgroup-item"> <input type="radio" name="value" value="1"
											class="selectgroup-input select-layout" checked> <span
											class="selectgroup-button">Light</span>
									</label> <label class="selectgroup-item"> <input type="radio" name="value" value="2"
											class="selectgroup-input select-layout">
										<span class="selectgroup-button">Dark</span>
									</label>
								</div>
							</div>
							<div class="p-15 border-bottom">
								<h6 class="font-medium m-b-10">Sidebar Color</h6>
								<div class="selectgroup selectgroup-pills sidebar-color">
									<label class="selectgroup-item"> <input type="radio" name="icon-input" value="1"
											class="selectgroup-input select-sidebar"> <span
											class="selectgroup-button selectgroup-button-icon" data-toggle="tooltip"
											data-original-title="Light Sidebar"><i class="fas fa-sun"></i></span>
									</label> <label class="selectgroup-item"> <input type="radio" name="icon-input"
											value="2" class="selectgroup-input select-sidebar" checked> <span
											class="selectgroup-button selectgroup-button-icon" data-toggle="tooltip"
											data-original-title="Dark Sidebar"><i class="fas fa-moon"></i></span>
									</label>
								</div>
							</div>
							<div class="p-15 border-bottom">
								<h6 class="font-medium m-b-10">Color Theme</h6>
								<div class="theme-setting-options">
									<ul class="choose-theme list-unstyled mb-0">
										<li title="white" class="active">
											<div class="white"></div>
										</li>
										<li title="cyan">
											<div class="cyan"></div>
										</li>
										<li title="black">
											<div class="black"></div>
										</li>
										<li title="purple">
											<div class="purple"></div>
										</li>
										<li title="orange">
											<div class="orange"></div>
										</li>
										<li title="green">
											<div class="green"></div>
										</li>
										<li title="red">
											<div class="red"></div>
										</li>
									</ul>
								</div>
							</div>
							<div class="p-15 border-bottom">
								<div class="theme-setting-options">
									<label> <span class="control-label p-r-20">Mini
											Sidebar</span> <input type="checkbox" name="custom-switch-checkbox"
											class="custom-switch-input" id="mini_sidebar_setting">
										<span class="custom-switch-indicator"></span>
									</label>
								</div>
							</div>
							<div class="p-15 border-bottom">
								<div class="theme-setting-options">
									<div class="disk-server-setting m-b-20">
										<p>Disk Space</p>
										<div class="sidebar-progress">
											<div class="progress" data-height="5">
												<div class="progress-bar l-bg-green" role="progressbar" data-width="80%"
													aria-valuenow="80" aria-valuemin="0" aria-valuemax="100"></div>
											</div>
											<span class="progress-description"> <small>26%
													remaining</small>
											</span>
										</div>
									</div>
									<div class="disk-server-setting">
										<p>Server Load</p>
										<div class="sidebar-progress">
											<div class="progress" data-height="5">
												<div class="progress-bar l-bg-orange" role="progressbar"
													data-width="58%" aria-valuenow="25" aria-valuemin="0"
													aria-valuemax="100"></div>
											</div>
											<span class="progress-description"> <small>Highly
													Loaded</small>
											</span>
										</div>
									</div>
								</div>
							</div>
							<div class="mt-4 mb-4 p-3 align-center rt-sidebar-last-ele">
								<a href="#" class="btn btn-icon icon-left btn-primary
										btn-restore-theme">
									<i class="fas fa-undo"></i> Restore Default
								</a>
							</div>
						</div>
					</div>
				</div>
			</div>
			<footer class="main-footer">
				<div class="footer-left">
					Copyright &copy; 2019
					<div class="bullet"></div>
					Design By <a href="#">Redstar</a>
				</div>
				<div class="footer-right"></div>
			</footer>
		</div>
	</div>
	<!-- General JS Scripts -->
	<script src="assets/js/app.min.js"></script>
	<!-- JS Libraies -->
	<script src="assets/bundles/chartjs/chart.min.js"></script>
	<script src="assets/bundles/apexcharts/apexcharts.min.js"></script>
	<script src="assets/bundles/jquery.sparkline.min.js"></script>
	<script src="assets/bundles/jqvmap/dist/jquery.vmap.min.js"></script>
	<script src="assets/bundles/jqvmap/dist/maps/jquery.vmap.world.js"></script>
	<script src="assets/bundles/jqvmap/dist/maps/jquery.vmap.indonesia.js"></script>
	<!-- Page Specific JS File -->
	<script src="assets/js/page/index2.js"></script>
	<script src="assets/js/page/todo.js"></script>
	<!-- Template JS File -->
	<script src="assets/js/scripts.js"></script>
	<!-- Custom JS File -->
	<script src="assets/js/custom.js"></script>
</body>

</html>